<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件操作</title>
</head>
<body>
<p>hello message</p>
<button>获取内容</button>
<button onclick="getMessage()">获取内容2</button>
<img src="1.png" alt="this is a picture" title="picture" width="200">
<button>下一张</button>
<button>上一张</button>
<script>
    //  绑定按钮的单击事件    1.  获取事件节点  2. 编写事件回调函数  3. 绑定事件
    let btn = document.querySelector('button')

    // 后绑定事件
    function getMessage() {
        let message = document.querySelector('p').innerText
        console.log(message)
    }

    btn.onclick = getMessage

    let btn2 = document.querySelector('#changImg')
    btn2.onclick = function () {
        document.querySelector('img').src = '2.png'
    }

</script>
</body>
</html>
